import React from 'react'
import { Route, Switch } from 'react-router-dom'
import routeConfig from './routeConfig'

/**
 * 根据一个路由配置数组，遍历该数组，得到一组Route组件 
 * @param {*} routes
 * @param {*} basePath 父路径
 * @return {*} 
 */
function getRoutes(routes, basePath = "") {
    if (!Array.isArray(routes)) return null
    const Routes = routes.map(({ children = [], path, component: Component, name, ...rest }, i) => {
        return <Route key={i} {...rest} path={`${basePath}` + path} render={values => {
            return <Component {...values} >
                {getRoutes(children, path)}
            </Component>
        }} />
    })
    return <Switch> {Routes} </Switch>
}

/**
 * 使用Route组件，根据不同的路径，渲染顶级页面
 * @export
 * @return {*} 
 */
export default function RootRouter() {
    return (
        <>
            {/* 返回一组Route */}
            {/* <Route path="/" exact component={Home} /> */}
            {getRoutes(routeConfig)}
        </>
    )
}
